<template>
  <view class="bg plr-30 pt-45">
    <view class="plr-30" style="background: #fff;border-radius: 20rpx;color: #3c3c3c;">
      <u-field v-model="con" label="头像" input-align="right" :disabled="true">
        <image v-if="info.head_image != ''" :src="info.head_image" mode="aspectFill" @click="upHead" class="upImg" slot="right"></image>
        <image src="../../static/upImg.png" mode="" @click="upHead" v-else class="upImg" slot="right"></image>
      </u-field>
      <u-field @click="toName" v-model="info.nick_name" label="昵称" input-align="right" placeholder="请填写昵称" :disabled="true"> </u-field>
      <u-field @click="toPhone" v-model="info.phone" label="手机号" input-align="right" :disabled="true"> </u-field>
      <u-field v-model="con" label="实名认证" input-align="right" :disabled="true" right-icon="arrow-right" :border-bottom="false">
        <view class="" slot="right" @click="toAuth">
          <text v-if="info.is_auth == 1">已认证</text>
          <text v-if="info.is_auth == 0">未认证</text>
        </view>
      </u-field>
      <!-- <u-button type="primary" hover-class="none" class="mt-100" @click="submitUser">提交</u-button> -->
      <!-- <view class="ptb-40 mlr-30">
        <button class="default-button" @click="submitUser">提交</button>
      </view> -->
    </view>
  </view>
</template>

<script>
import { upload } from '../../common/common.js'
export default {
  data() {
    return {
      con: '',
      info: {},
    }
  },
  onShow() {
    this.init()
  },
  methods: {
		toName () {
			uni.navigateTo({
				url:'/pages/my/editName'
			})
		},
		toPhone () {
			uni.navigateTo({
				url:'/pages/login/editPhone'
			})
		},
    upHead() {
      upload().then(data => {
        // this.info.head_image = data.path
				this.$http(
				  'api/user/editUserInfo',
				  {
						nick_name: this.info.nick_name,
				    head_image: data.path
				  },
				  'POST'
				).then(res => {
				  uni.showToast({
				    title: '修改成功!',
				  })
				  this.init()
				})
      })
    },
    init() {
      this.$http('api/user/userInfo').then(res => {
        this.info = res
      })
    },
    toAuth() {
      uni.navigateTo({
        url: './realAuth',
      })
    },
    submitUser() {
      if (this.info.nick_name == '') {
        uni.showToast({
          title: '请输入昵称!',
          icon: 'none',
        })
        return
      }
      if (this.info.head_image == '') {
        uni.showToast({
          title: '请上传头像!',
          icon: 'none',
        })
        return
      }
      this.$http(
        'api/user/editUserInfo',
        {
          nick_name: this.info.nick_name,
          head_image: this.info.head_image,
        },
        'POST'
      ).then(res => {
        uni.showToast({
          title: '修改成功!',
        })
        this.init()
      })
    },
  },
}
</script>
<style>
	page {
		background: #f5f5f5;
	}
</style>
<style lang="less" scoped>
.upImg {
  width: 76rpx;
  height: 76rpx;
  border-radius: 50%;
  border: 2rpx solid #ededed;
}

.u-field {
  color: #3c3c3c;
}
/deep/ .u-field {
	padding: 30rpx 0 !important;
}

.default-button {
  height: 100rpx;
  background: #fff;
  border-radius: 50rpx;
  font-size: 32rpx;
  color: #282828;
  display: flex;
  justify-content: center;
  align-items: center;
}
</style>
